(function(){


var Pole = function(options){
	/*
	options = {
		container:DOM,
		height:n,
		width:n,
		barStyle :{},
		innerBarStyle:{},
		poleStyle:{},
		onchange : function(v){},
		max:100,
		min:0,
		value:50
	}
	*/
	var v,barStyle,innerBarStyle,poleStyle;
	this.container = options.container;
	this.options = options;
	this.baseValue = {};
	this.baseValue.min = options.min;
	this.baseValue.max = options.max;
	if(this.baseValue.min!=undefined&&this.baseValue.max!=undefined)
	{
		this.baseValue.diff = (options.max - options.min)/100;
	}
	else
	{
		this.baseValue.diff = 1;
	}

	this.value = this.options.value; //设置默认值,这个值是 options.min与options.max间

	this.bar = document.createElement("div");
	this.bar.className = options.className || "Pole";
	this.bar.style.position = "relative";
	this.bar.style.width = (this.options.width || this.container.offsetWidth)+"px";

	this.btn = document.createElement("span");
	this.btn.style.position = "absolute";
	this.btn.style.left = "0";

	this.step = document.createElement("div");
	this.step.className = "Pole-over";
	this.step.style.position = "absolute";
	this.step.style.left = "0";
	this.step.style.top = "0";
	this.step.style.bottom = "0";

	barStyle = this.options.barStyle;
	innerBarStyle = this.options.innerBarStyle;
	poleStyle = this.options.poleStyle;

	if(barStyle!=undefined)
	{
		for(v in barStyle)
		{
			this.bar.style[v] = barStyle[v];
		}
	}
	if(innerBarStyle!=undefined)
	{
		for(v in innerBarStyle)
		{
			this.step.style[v] = innerBarStyle[v];
		}
	}
	if(poleStyle!=undefined)
	{
		for(v in poleStyle)
		{
			this.btn.style[v] = poleStyle[v];
		}
	}

	this.bar.appendChild(this.step);
	this.bar.appendChild(this.btn);
	this.container.appendChild(this.bar);
	this.init();
	this.convertValue = (this.value/this.baseValue.diff);  //计算转化后的值,即:在0--100之间的值
	if(this.convertValue==0)
	{
		this.convertValue = 0;
	}
	this.convertX = (this.convertValue/100)*(this.bar.offsetWidth - this.btn.offsetWidth);
	//通过this.convertValue 转换出滑竿的位置
	console.log(this.convertX);
	this.ondrag(this.convertValue , this.convertX);
}
Pole.prototype = {
	init: function () {
		var f = this, g = document, b = window, m = Math;
		f.btn.onmousedown = function (e) {
			var x = (e || b.event).clientX;
			var l = this.offsetLeft;
			var max = f.bar.offsetWidth - this.offsetWidth;
			g.onmousemove = function (e) {
				var thisX = (e || b.event).clientX;
				var to = m.min(max, m.max(-2, l + (thisX - x)));
				f.btn.style.left = to + 'px';
				f.ondrag(m.round(m.max(0, to / max) * 100), to);
				b.getSelection ? b.getSelection().removeAllRanges() : g.selection.empty();
			};
			g.onmouseup = new Function('this.onmousemove=null');
		};
	},
	ondrag: function (value, x) {
		this.step.style.width = Math.max(0, x) + 'px';
		this.btn.style.left = x + 'px';
		this.value = value * this.baseValue.diff;
		this.options.onchange&&this.options.onchange.call(this,this.value);
	},
	getValue : function(){
		return this.value;
	},
	setValue : function(v){
		//v is options.min options.max 之间的值
		if(v<this.options.min || v>this.options.max)
		{
			return;
		}
		this.convertValue = (v/this.baseValue.diff);  //计算转化后的值,即:在0--100之间的值
		if(this.convertValue==0)
		{
			this.convertValue = 0;
		}
		this.convertX = (this.convertValue/100)*(this.bar.offsetWidth - this.btn.offsetWidth);
		this.ondrag(this.convertValue , this.convertX);
	}
}


window.Pole = Pole;
})();

/*

pole = new Pole({
	container: document.getElementById("container"),
	barStyle : {
		"top":"2px",
		"height":"5px",
		"background-color":"#ccc",
		"border-radius":"5px"
	},
	innerBarStyle : {
		"height":"5px",
		"background-color":"#f00",
		"width":"10px"
	},
	poleStyle:{
		"height":"9px",
		"top":"-2px",
		"width":"5px",
		"background-color":"#0f0"
	},
	onchange : function(v){
		console.log("v:",v);
	},
	value : 0,
	max : 50,
	min : 0
});

pole.getValue();
pole.setValue(v);
*/